<template>
    <div class="date-picker">
        <el-date-picker v-model="date" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" size="small" />
    </div>
</template>

<script setup lang="js">
import { ref, watch } from 'vue'

const emits = defineEmits(["handleFieldChange"])

const props = defineProps({
    data: {
        default: () => ({
            type: "", // 组件类型
            url: "", // 组件数据接口地址
            field: "" // 传给后端的key 属性名称
        })
    }
})

const date = ref("2025-02-03")

// 监听数据有值 并且发生变化触发
watch(() => date.value, (newVal) => {
    if (newVal) {
        emits("handleFieldChange", props.data.field, newVal)
    }
}, { immediate: true })

</script>
<style scoped lang="scss">
.date-picker {}
</style>